<template>
    <basic-container>
      <div style="width:100%;min-height: 50px;padding-left:5px;display: inline-block;">
        <el-container>
          <el-container>
            <el-aside width="150px">
              <el-button type="primary" @click="saveLine" style="float: left;">保存</el-button>
              <el-button type="primary" @click="handlePrint" style="float: left;">打印</el-button>
            </el-aside>
            <el-container>
              <el-main style="background: #fff!important">
                <div v-for="arr in logList" style="width:120px;margin-left: 10px;min-height: 20px;font-size: 12px;float: left;">
                  <span>{{arr.operator}}</span>
                  <br/>
                  <span style="width:100px">{{arr.time}}</span>
                </div>
              </el-main>
            </el-container>
          </el-container>
        </el-container>
      </div>
      <template>
        <div id="printDetail">
          <br/>
          <div class="pull-auto"  style="text-align: left;font-size: 16px;color:#3478f5">
            <div class="block">
              产线类型： {{productLineType}}<i class="el-breadcrumb__separator el-icon-arrow-right"></i>品号：{{articleNumber}} <i class="el-breadcrumb__separator el-icon-arrow-right"></i>实际产线名称：{{realityLineName}}<i class="el-breadcrumb__separator el-icon-arrow-right"></i>组织：{{organizationName}}<i class="el-breadcrumb__separator el-icon-arrow-right"></i>工艺产线名称：{{craftLineName}}            </div>
          </div>
          <br/>
          <el-container>
            <el-main class="demo">
                <avue-flow :height="800"
                                  width="100%"
                                  ref="flow"
                                  :option="option"
                                  v-model="flowForm">
                <template #header="{node}" >
                  {{(node || {}).name}}
                </template>
                <template slot-scope="{node}">
                  <el-descriptions  class="margin-top"  title="工序属性" :column="1" size="small" border >
                    <el-descriptions-item v-for="attr in processAttributeList" :label="attr.attributeName">
                      <avue-select   v-model="form[node.id+`_`+attr.attributeField]" disabled multiple v-if="attr.attributeName!='设备' && attr.attributeName!='工具'&& attr.attributeName!='夹具'" filterable clearable  dialogWidth="100%"  :placeholder="`请选择`+attr.attributeName"  :props="{label: 'label',value: 'value'}"  :dic=" processAttributeDataList[attr.attributeField]" ></avue-select>

                      <deviceSelect   :ref="node.id+`_`+attr.attributeField+`Page`"
                                      v-model="form[node.id+`_`+attr.attributeField]"
                                      v-if="(attr.attributeName=='设备' || attr.attributeName=='工具'|| attr.attributeName=='夹具') && processAttributeDataList[attr.attributeField]!=null"
                                      :attributeName="attr.attributeName"
                                      :attributeField="attr.attributeField"
                                      :organizationName="organizationName"
                                      :deviceClass="form[node.id+`_deviceClass`]"
                                      :nodeId = "node.id"
                                      :seleteOptions="processAttributeDataList[attr.attributeField]"
                                      :defaultVal ="form[node.id+`_`+attr.attributeField]"
                                      @handleSelectData = "handleSelectData"/>
                      <div element-loading-text="拼命加载中"  element-loading-spinner="el-icon-loading" v-loading="(attr.attributeName=='设备' || attr.attributeName=='工具'|| attr.attributeName=='夹具') && processAttributeDataList[attr.attributeField]==null"></div>

                    </el-descriptions-item>
                    <el-descriptions-item label="设备分类">
                      <avue-select   v-model="form[node.id+`_deviceClass`]" filterable clearable  disabled dialogWidth="100%"  multiple placeholder="请选择设备分类"  :props="{label: 'label',value: 'value'}"  :dic="deviceClassList" ></avue-select>
                    </el-descriptions-item>
                  </el-descriptions>
                </template>
              </avue-flow>

            </el-main>
          </el-container>

        <avue-crud style="margin-top:10px"
           ref="crud"
           :data="realityLineSubData"
           :table-loading="tableLoading"
           :option="tableOption"
           @on-load="" >
          <template slot-scope="scope" slot="menu">
            <el-button type="text"
                       icon="el-icon-postcard"
                       size="small"
                       plain
                       @click="uploadopen(scope.row,scope.index)">作业指导书</el-button>
          </template>
        </avue-crud>

         <el-dialog title="作业指导书上传、预览"
                    :visible.sync="workingBookUpload"
                    width="50%"
                    :before-close="handleClose"
                    append-to-body
                    lock-scroll>
           <div class="pull-auto" v-loading="loading" style="display: flow-root;">
             <div  style="text-align: center;width: 50%;float: left;border-right:1px solid  #ccc">
               <el-upload
                 ref="workingBookRef"
                 class="avatar-uploader"
                 accept="application/pdf"
                 list-type="picture-card"
                 action="#"
                 :file-list="workingBookFileList"
                 :show-file-list="false"
                 :on-success="handleSuccess"
                 :http-request="uploadFile"
                 :auto-upload="false"
                 :before-remove="beforeRemove"
                 :on-change="workingBookChange"
                 :limit="2"
                 :before-upload="handleBeforeUpload">
                 <i class="el-icon-plus"></i>
               </el-upload>
             </div>
             <div  style="text-align: center;width: 48%;float: left;">
               <a target="_blank" :href="workingBookFileListPDF">{{workingBookFileListPDFName}}</a><el-tag v-if="workingBookFileListPDF!='#'"   style="cursor:pointer;margin-left: 10px" type="danger" @click="deleteWorkingBook">删除</el-tag>
             </div>
             <div style="text-align: center;width: 100%;float: left">
               <div class="pull-auto"  style="text-align: center;margin-top:20px;">
                 <el-button size="small"  type="primary" @click="submitUpload">立即上传</el-button>
                 <el-button size="small"  @click="cancelUpload">取 消</el-button>
               </div>
             </div>
           </div>
         </el-dialog>
        </div>
      </template>
    </basic-container>
</template>

<script>
    import { getProcessAttributeList,getProcessAttributeDataAllList,getDeviceClassList} from '@/api/pfoc/processattribute'
    import {updateRealityProdictLine,getRealityProductLineDetailsList} from '@/api/pfoc/realityproductline'
    import { uploadSubmit,deletWorkBook,getRealityLineDetails } from '@/api/pfoc/realityproductlinedetails'
    import { getLogList} from '@/api/pfoc/productlinelog'
    import { tableOption } from '@/const/crud/pfoc/realityproductlinedetails'
    /**引入设备下拉框*/
    import deviceSelect from '@/views/pfoc/realityproductline/custom-select'
    export default {
        name: "edit-reality-line",
        components: {
            //设备下拉框
            deviceSelect,
        },
        props:{
            lineId:{
                type:String
            },
            productLineTypeList:{//产线类型集合
                type:Array
            }
        },
        data() {
            return {
                count: 0,
                nodeCount:0,//节点下标
                form: [],//提交时数据集合
                flowForm:'',
                processAttributeList:[],//工序通用属性集合
                processAttributeDataList:[],//工序通用属性数据集合
                deviceClassList:[],//设备分类集合
                articleNumber:null,//品号
                craftLineName:null,//实际产线名称
                organizationId:null,//组织ID
                organizationName:null,//组织名称
                realityLineMainData:{},//实际产线主变数据
                realityLineSubData:[],//实际产线子表数据
                realityLineDeviceConfigListDeleteIds:[],//实际产线设备配置需要删除的ID集合
                realityLineName:null,//实际产线名称
                tableLoading: false,
                tableOption: tableOption,
                option: {
                    name: null,
                    nodeList: [],//工序节点集合
                    lineList: [],//工序各节点指向顺序集合
                },
                workingBookUpload:false,//作业指导书上传窗口
                workingBookFileList:[],//控制作业指导书列表上传前可以切换文件
                workingBookFileListBack:[],//作业指导书列表上传前备份存储用于失败后回显初始文件
                workingBookFileListPDF:"#",//显示作业指导书PDF
                workingBookFileListPDFName:"",//显示作业指导书PDF名称
                fileData: new FormData(),
                loading:false,
                id: null,
                logList:[],//操作日志集合
                productLineType:null,//产线类型
            };
        },
        created() {
            //获取当前产线日志
            this.getLogListData();
        },
        computed: {
            nodeList () {
                return this.option.nodeList
            }

        },
        mounted() {
            //获取通用工序属性
            this.getProcessAttributeListData();
            //获取通用工序属性数据
            this.getProcessAttributeDataListData();
            //获取设备分类数据
            this.getDeviceClassListData();
        },
        methods: {
            getRealityProductLineDetails(){
                if(!this.validatenull(this.lineId)) {
                    this.tableLoading = true
                    getRealityProductLineDetailsList(this.lineId).then(response => {
                        this.$refs.flow.resetPlumb();
                        var data =response.data.data;
                        //获取实际产线主表数据
                        this.realityLineMainData= data.realityProductLine;//实际产线主变数据
                        //获取实际产线子表数据
                        this.realityLineSubData = data.realityProductLineDetailsList;//实际产线子表数据
                        //实际产线设备配置需要删除的ID集合
                        this.realityLineDeviceConfigListDeleteIds=data.realityLineDeviceConfigListDeleteIds;
                        //品号
                        this.articleNumber=this.realityLineMainData.articleNumber;
                        //工艺产线名称
                        this.craftLineName=this.realityLineMainData.craftLineName;
                        //实际产线名称
                        this.realityLineName =this.realityLineMainData.realityLineName;
                        //组织名称
                        this.organizationName = this.realityLineMainData.organizationName;
                        //组织ID
                        this.organizationId = this.realityLineMainData.organizationId;
                        this.productLineType=this.realityLineMainData.productLineType;//产线类型
                        //设置反显工序
                        this.option.nodeList = JSON.parse(this.realityLineMainData.processNodes);
                        //设置反显工序指向顺序
                        this.option.lineList =  JSON.parse(this.realityLineMainData.processNodeLine);
                        //初始化节点下标
                        var n =  this.option.nodeList[ this.option.nodeList.length-1].id;
                        this.nodeCount = parseInt(n.split("node")[1])+1;

                        //注册动态节点变量
                        for(var n=0;n<this.realityLineSubData.length;n++) {
                            var  nodeId = this.realityLineSubData[n].nodeId;
                            for (var i = 0; i < this.processAttributeList.length; i++) {
                                var valueStr = this.realityLineSubData[n][this.processAttributeList[i].attributeField];
                                if(this.validatenull(valueStr)){//判空
                                    this.$set(this.form, nodeId+"_"+this.processAttributeList[i].attributeField,valueStr);
                                }else{
                                    this.$set(this.form, nodeId + "_" + this.processAttributeList[i].attributeField, valueStr.split(","));
                                }
                                if(this.processAttributeList[i].attributeName=='设备' || this.processAttributeList[i].attributeName=='工具'|| this.processAttributeList[i].attributeName=='夹具'){
                                    var nameStr = this.realityLineSubData[n][this.processAttributeList[i].attributeField + "Names"];
                                    this.$set(this.form, nodeId + "_" + this.processAttributeList[i].attributeField + "Name",nameStr);//注册动态节点-设备名称
                                }
                            }
                            this.$set(this.form, nodeId+ "_processId", this.realityLineSubData[n].processId);//注册动态节点-当前工序ID
                            if(this.validatenull(this.realityLineSubData[n].deviceClass)){
                                this.$set(this.form, nodeId+ "_deviceClass", this.realityLineSubData[n].deviceClass);//注册动态节点-设备类型
                            }else {
                                this.$set(this.form, nodeId + "_deviceClass", this.realityLineSubData[n].deviceClass.split(","));//注册动态节点-设备类型
                            }
                        }
                        //重新初始化flow组件
                        this.$refs.flow.init();
                        //重置自定义下拉框选项
                        if(!this.validatenull(this.processAttributeDataList)) {
                            for (var i = 0; i < this.option.nodeList.length; i++) {
                                var nodeId = this.option.nodeList[i].id;
                                var obj = new Object();//创建对象
                                //循环工序属性取出每个工序的个属性数据加入到对象
                                for (var j = 0; j < this.processAttributeList.length; j++) {
                                    if (this.processAttributeList[j].attributeName == '设备' || this.processAttributeList[j].attributeName == '工具' || this.processAttributeList[j].attributeName == '夹具') {
                                        let ref = nodeId + "_" + this.processAttributeList[j].attributeField + "Page";//获取到当前的ref
                                        this.$nextTick(() => {
                                            this.$refs[ref][0].deviceSelectInit();
                                        })
                                    }

                                }
                            }
                        }
                        console.log(this.form)
                        // console.log(this.option.nodeList)
                        // console.log(this.option.lineList)
                        this.tableLoading = false
                    }).catch(() => {
                        this.tableLoading = false
                    })
                }
            },

            /**获取通用工序属性*/
            getProcessAttributeListData(){
                getProcessAttributeList().then(response => {
                    this.processAttributeList=response.data.data;
                    // console.log(this.processAttributeList)
                })

            },
            /**获取通用工序属性数据*/
            getProcessAttributeDataListData(){
                getProcessAttributeDataAllList().then(response => {
                    this.processAttributeDataList=response.data.data;
                    for(var i=0;i<this.option.nodeList.length;i++){
                        var nodeId = this.option.nodeList[i].id;
                        var obj = new Object();//创建对象
                        //循环工序属性取出每个工序的个属性数据加入到对象
                        for(var j=0;j<this.processAttributeList.length;j++){
                            if(this.processAttributeList[j].attributeName=='设备' || this.processAttributeList[j].attributeName=='工具'|| this.processAttributeList[j].attributeName=='夹具'){
                                let ref = nodeId+"_"+this.processAttributeList[j].attributeField+"Page";//获取到当前的ref
                                this.$nextTick(() => {
                                    this.$refs[ref][0].deviceSelectInit();
                                })
                            }

                        }
                    }
                })
            },
            /**获取设备分类数据*/
            getDeviceClassListData(){
                getDeviceClassList().then(response => {
                    this.deviceClassList=response.data.data;
                    // console.log(this.deviceClassList)
                })
            },

            /**保存修改实际产线*/
            saveLine(){
                if(this.validatenull(this.realityLineName)){
                    this.$message.warning("请输入实际产线名称。")
                    return;
                }
                if(this.validatenull(this.craftLineName)){
                    this.$message.warning("请选择工艺产线。")
                    return;
                }
                if(this.validatenull(this.articleNumber)){
                    this.$message.warning("品号不能为空。")
                    return;
                }
                if(this.validatenull(this.option.nodeList)){
                    this.$message.warning("请选择工艺产线。")
                    return;
                }
                if(this.validatenull(this.organizationName)){
                    this.$message.warning("请选择组织。")
                    return;
                }
                //组装需要提交的数据-实际产线主表数据组装
                var params = {};//主表参数集合
                params.id = this.lineId;//实际产线ID
                params.realityLineName = this.realityLineName;//实际产线名称
                params.articleNumber = this.articleNumber;//品号
                params.craftLineName = this.craftLineName;//工艺产线名称
                params.organizationName = this.organizationName;//组织名称
                params.organizationId = this.organizationId;//组织ID
                params.productLineType = this.productLineType;//产线类型名称
                params.processNodes = JSON.stringify(this.option.nodeList);//工序节点集合（其中mark字段为工序ID）
                params.processNodeLine = JSON.stringify(this.option.lineList);//工序各节点指向顺序集合

                //组装需要提交的数据-实际产线子表数据组装
                var objArr = [];
                var messageArr=[];
                //循环工序节点集合
                for(var i=0;i<this.option.nodeList.length;i++){
                    var message = new Object();//未选择数据时错误消息对象
                    var error =[];//未选择数据时错误消息集合
                    var obj = new Object();//创建对象
                    //循环工序属性取出每个工序的个属性数据加入到对象
                    for(var j=0;j<this.processAttributeList.length;j++){
                        //将工序属性集合中的属性加入对象同时取出form集合中对应的属性数据放入属性对象中
                        if(!this.validatenull(this.form[this.option.nodeList[i].id+'_'+this.processAttributeList[j].attributeField])) {
                            obj[this.processAttributeList[j].attributeField] = this.form[this.option.nodeList[i].id + '_' + this.processAttributeList[j].attributeField].toString();
                        }else{
                            obj[this.processAttributeList[j].attributeField] =null;
                            error.push(this.processAttributeList[j].attributeName);
                        }
                        if(this.processAttributeList[j].attributeName=='设备' || this.processAttributeList[j].attributeName=='工具'|| this.processAttributeList[j].attributeName=='夹具'){
                            if(!this.validatenull(this.form[this.option.nodeList[i].id + '_' + this.processAttributeList[j].attributeField+ "Name"])){
                                obj[this.processAttributeList[j].attributeField + "Names"] = this.form[this.option.nodeList[i].id + '_' + this.processAttributeList[j].attributeField+ "Name"];
                            }else{
                                obj[this.processAttributeList[j].attributeField + "Names"] = null;
                            }
                        }
                    }
                    if(!this.validatenull(this.form[this.option.nodeList[i].id + '_deviceClass'])) {//设备分类
                        obj['deviceClass'] = this.form[this.option.nodeList[i].id + '_deviceClass'].toString();
                    }else{
                        obj['deviceClass'] = this.form[this.option.nodeList[i].id + '_deviceClass']
                        error.push("设备分类")
                    }
                    if(error.length>0){
                        message["工序"] = this.option.nodeList[i].name;
                        message["属性"] = error;
                        messageArr.push(message);
                    }
                    obj['processId'] = this.option.nodeList[i].mark;//取出工序ID加入对象
                    obj['processName'] = this.option.nodeList[i].name;//取出工序名称加入对象
                    obj['nodeId'] = this.option.nodeList[i].id;
                    obj['organizationName'] = this.organizationName;//组织名称
                    obj['organizationId'] = this.organizationId;//组织ID
                    //修改数据数组赋予ID
                    for (var n=0;n< this.realityLineSubData.length;n++){
                        if(this.realityLineSubData[n].nodeId == this.option.nodeList[i].id){
                            obj['id'] = this.realityLineSubData[n].id
                        }
                    }
                    //最后加入提交数据数组
                    objArr.push(obj)
                }
            /*    //漏填提醒
                if(!this.validatenull(messageArr)){
                    this.$message.warning(JSON.stringify(messageArr)+"——等数据未选择。")
                    return;
                }*/

                //组装需要提交的数据-实际产线设备配置表数据组装
                var deviceArr = [];
                //循环工序节点集合
                for(var i=0;i<this.option.nodeList.length;i++){
                    //循环工序属性取出每个工序的个属性数据加入到对象
                    for(var j=0;j<this.processAttributeList.length;j++){
                        //将工序属性集合中的属性加入对象同时取出form集合中对应的属性数据放入属性对象中
                        if(this.processAttributeList[j].attributeName=='设备'){
                            var deviceSnArr = this.form[this.option.nodeList[i].id + '_' + this.processAttributeList[j].attributeField];
                            var deviceNameArr = null;
                            if(!this.validatenull(this.form[this.option.nodeList[i].id + '_' + this.processAttributeList[j].attributeField+ "Name"])) {
                                 deviceNameArr = this.form[this.option.nodeList[i].id + '_' + this.processAttributeList[j].attributeField + "Name"].split(',');
                            }
                            if(!this.validatenull(deviceSnArr)) {
                                for (var n = 0; n < deviceSnArr.length; n++) {
                                    var obj = new Object();//创建对象
                                    obj['deviceSn'] = deviceSnArr[n];//设备编码
                                    obj['deviceName'] = deviceNameArr[n];//设备名称
                                    obj['processId'] = this.option.nodeList[i].mark;//取出工序ID加入对象
                                    obj['processName'] = this.option.nodeList[i].name;//取出工序名称加入对象
                                    obj['nodeId'] = this.option.nodeList[i].id;
                                    obj['organizationName'] = this.organizationName;//组织名称
                                    obj['organizationId'] = this.organizationId;//组织ID
                                    //最后加入提交数据数组
                                    deviceArr.push(obj)
                                }
                            }
                        }
                    }

                }
                console.log(objArr)
                var data={
                    realityProductLine:params,
                    realityProductLineDetailsList:objArr,
                    realityLineDeviceConfigList:deviceArr,
                    realityLineDeviceConfigListDeleteIds:this.realityLineDeviceConfigListDeleteIds
                }
                //提交
                updateRealityProdictLine(data).then(response => {
                    this.$message.success("修改成功。")
                    var total = response.data.data;
                    //获取实际产线子表数据
                    this.realityLineSubData = total.realityProductLineDetailsList;//实际产线子表数据
                    //实际产线设备配置需要删除的ID集合
                    this.realityLineDeviceConfigListDeleteIds=total.realityLineDeviceConfigListDeleteIds;
                    this.$emit('closeEditReality');//关闭修改页面
                    this.getLogListData();//重新获取操作日志
                });
            },
            handleClick (node) {
                this.$message.success(JSON.stringify(node))
            },
            handleNext () {
                this.count++
                if (this.count >= this.nodeList.length) {
                    this.count = 0;
                }
                this.flowForm = this.nodeList[this.count].id;
            },
            viewShunxu(){
                this.$message.success(JSON.stringify(this.option.lineList))
                /*this.$message.success(JSON.stringify(this.option.nodeList))*/
            },
            handleSelectData(obj){
                this.form[obj.nodeId+"_"+obj.attributeField] = obj.deviceSn;
                this.$set(this.form,obj.nodeId+"_"+obj.attributeField + "Name", obj.deviceName);//注册动态节点-设备名称
                // console.log(this.form)
            },
            refreshChange(){
                getRealityLineDetails(this.lineId).then(response => {
                    //获取产线子表数据
                    this.realityLineSubData = response.data.data;//产线子表数据
                })
            },
            //打开图片上传窗口
            uploadopen: function (row, index) {
                this.id = row.id;
                this.workingBookUpload = true; //打开作业指导书上传窗口
                if (row.workingBook != "" && row.workingBook != null) {
                    const fileType = row.workingBook.substring(row.workingBook.lastIndexOf('.'));
                    let imageUrl = row.workingBook;
                    let obj = new Object();
                    obj.url = imageUrl;
                    obj.name = row.workingBookName;
                    this.workingBookFileListBack.push(obj);//重新上传失败时回显使用
                    if(fileType === '.pdf') {
                        this.workingBookFileListPDF=imageUrl;
                        this.workingBookFileListPDFName=row.workingBookName;
                    }
                }
            },
            //作业指导书上传文件选择
            workingBookChange(file, fileList){
                const isType = file.name.substring(file.name.lastIndexOf('.'));
                this.workingBookFileList = fileList.slice(-1);
                if(isType === '.pdf'){
                    this.workingBookFileListPDF=file.url;
                    this.workingBookFileListPDFName=file.name;
                }
            },
            // 上传多图片
            uploadFile(file) {
                this.fileData.append('file[]', file.file)
                return false
            },
            // 上传之前的钩子
            handleBeforeUpload(file){
                var isType=null;
                isType = file.type==='application/pdf';
                if (!isType) {
                    this.$notify.warning({
                        title: '警告',
                        message: '请上传格式为application/pdf格式的作业指导书文件。'
                    })
                }

                const isLt = file.size / 1024 / 1024 < 10;
                if (!isLt) {
                    this.$notify.warning({
                        title: '警告',
                        message: '上传作业指导书文件大小不能超过 10MB!'
                    })
                }
                return isType && isLt;
            },
            //上传成功
            handleSuccess(res,file, fileList){
                this.$refs.workingBookRef.clearFiles();
                this.refreshChange()
            },
            //取消上传
            cancelUpload(){
                this.id =null;
                this.workingBookUpload = false;
                this.workingBookFileList=[];
                this.workingBookFileListPDF="#";
                this.workingBookFileListPDFName="";
                this.workingBookFileListBack=[];
                this.fileData =new FormData();

            },
            // 上传到服务器
            submitUpload() {
                this.$refs.workingBookRef.submit(); // 提交调用uploadFile函数
                if (!this.fileData.has("file[]")) {
                    this.$message({
                        message: '请先选择文件',
                        type: 'warning'
                    })
                    return false;
                }else {
                    this.fileData.append("id", this.id);
                    this.loading = true;
                    uploadSubmit(this.fileData).then(response => {
                        this.$message({
                            message: "上传成功了",
                            type: 'success'
                        });
                        var workingBook = response.data.data.workingBook;
                        var workingBookName = response.data.data.workingBookName;
                        if (workingBook != "" && workingBook != null) {
                            const fileType = workingBook.substring(workingBook.lastIndexOf('.'));
                            let imageUrl = workingBook;
                            let obj = new Object();
                            obj.url = imageUrl;
                            obj.name = workingBookName;
                            this.workingBookFileListBack=[];
                            this.workingBookFileList=[];
                            this.workingBookFileListBack.push(obj);
                            if(fileType === '.pdf') {
                                this.workingBookFileListPDF=imageUrl;
                                this.workingBookFileListPDFName=workingBookName;
                            }
                        }
                        this.fileData = new FormData();
                        this.refreshChange();
                        this.loading = false;
                    }).catch(response => {
                        this.$message({
                            message: "上传失败了",
                            type: 'error'
                        });
                        this.loading = false;
                        this.fileData = new FormData();
                        if(this.workingBookFileListBack.length>0){
                            var workingBook =this.workingBookFileListBack[0].url;
                            var workingBookName = this.workingBookileListBack[0].name;
                            if (workingBook != "" && workingBook != null) {
                                const fileType = workingBook.substring(workingBook.lastIndexOf('.'));
                                let imageUrl = workingBook;
                                let obj = new Object();
                                obj.url = imageUrl;
                                obj.name = workingBookName;
                                this.workingBookFileListBack=[];
                                this.workingBookFileList=[];
                                this.workingBookFileListBack.push(obj);
                                if(fileType === '.pdf') {
                                    this.workingBookFileListPDF=imageUrl;
                                    this.workingBookFileListPDFName=workingBookName;
                                }
                            }
                        }else{
                            this.workingBookFileList=[];
                            this.workingBookFileListPDF="#";
                            this.workingBookFileListPDFName="";
                            this.workingBookFileListBack=[];
                        }
                    })
                }
            },
            //弹窗关闭之前
            handleClose(done) {
                this.cancelUpload();
                this.loading=false;
            },
            beforeRemove(file, fileList) {
                return this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    if(this.workingBookFileListBack.length>0){
                        var workingBook =this.workingBookFileListBack[0].url;
                        var workingBookName = this.workingBookileListBack[0].name;
                        if (workingBook != "" && workingBook != null) {
                            const fileType = workingBook.substring(workingBook.lastIndexOf('.'));
                            let imageUrl = workingBook;
                            let obj = new Object();
                            obj.url = imageUrl;
                            obj.name = workingBookName;
                            this.workingBookFileListBack=[];
                            this.workingBookFileList=[];
                            this.workingBookFileListBack.push(obj);
                            if(fileType === '.pdf') {
                                this.workingBookFileListPDF=imageUrl;
                                this.workingBookFileListPDFName=workingBookName;
                            }
                        }
                    }else{
                        this.workingBookFileList=[];
                        this.workingBookFileListPDF="#";
                        this.workingBookFileListPDFName="";
                        this.workingBookFileListBack=[];
                    }
                });

            },
            //作业指导书文件删除
            deleteWorkingBook(){
                var formdata = new FormData();
                formdata.append("id", this.id);
                deletWorkBook(formdata).then(response => {
                    this.$message({
                        message: "删除成功",
                        type: 'success'
                    });
                    this.workingBookFileList=[];
                    this.workingBookFileListPDF="#";
                    this.workingBookFileListPDFName="";
                    this.workingBookFileListBack=[];
                    this.refreshChange();
                }).catch(response => {
                    this.$message({
                        message: "删除失败",
                        type: 'error'
                    });
                })
            },
            //作业指导书PDF点击下载
            handlePDFDownload(file) {
                var a = document.createElement('a');
                var event =new MouseEvent('click');
                a.download = file.name;
                a.href = file.url;
                a.dispatchEvent(event);
                console.log(file)
            },
            //打印
            handlePrint () {
                this.$Print('#printDetail');
            },
            //获取产线日志
            getLogListData(){
                getLogList(this.lineId).then(response => {
                    this.logList=response.data.data;
                })
            }

        }
    };
</script>

<style scoped>
  /deep/.avue-flow__node{
    height: auto!important;
  }
  /deep/ .avue-flow__node-header {
    line-height: 30px;
  }
  /deep/.el-descriptions__title {
    font-size: 14px;
    font-weight: 400;
    margin-top: 5px;
  }

  /*以下样式是打印的时候avue表格错乱修正方式（主要是序号列和操作列固定影响的）*/
  /deep/.el-table__fixed{
    display: none!important;
  }
  /deep/.el-table__fixed-right{
    display: none!important;
  }
  /deep/.el-table__cell.is-hidden>*{visibility:visible !important;}

  /deep/ .avue-grid{
    display: none!important;
  }
  /deep/.el-main{
    background:#efefef !important;
  }
  /deep/.el-card__body{
    padding: 0px!important;
  }
  /*去掉滚动条样式*/
  .demo::-webkit-scrollbar {
    display: none; /* Chrome Safari */
  }
  .demo {
    scrollbar-width: none; /* firefox */
    -ms-overflow-style: none; /* IE 10+ */
    overflow-x: hidden;
    overflow-y: auto;
  }

</style>
